<extend name="./ljfbase" />
    <block name="main">
        <script src="__PUBLIC__/js/jquery.min.js"></script>
        <div class="container">
            <div class="col-md-10 col-md-offset-1 mt30">

                <div class="row" style="background-color: #ccc">
                    <div class="col-md-1 mt10"><p class="text-primary">日志</p></div>
                    <div class="pull-right col-md-2"><p class="text-right"><a class="btn btn-link" href="{:U('Log/index',array('user_id'=>$vuser['id']))}">返回日志列表</a></p></div>
                </div>

                <div class="row" style="background-color: #feeeed">
                    <div class="ml10">
                        <ul class="list-inline">
                            <li><h1>{$log.title}</h1></li>
                            <li class="ml20">{$log.ctime|date="Y-m-d H:i:s",###}</li>
                        </ul>
                        <ul class="list-inline ml10" id="zan">
                            <li class="ml10"><a class="btn btn-link act-fav" dataid={$log.id}><if condition="$is_fav eq 1">取消赞<else/>赞({$zan_num})</if></a></li>
                            <li class="ml10"><a class="btn btn-link">评论({$num})</a></li>
                            <li class="ml10"><a class="btn btn-link" href="{:U('edit',array('logid'=>$log[id],'user_id'=>$log['uid']))}">编辑</a></li>
                            <li class="ml10"><a class="btn btn-link" href="{:U('del',array('logid'=>$log[id],'user_id'=>$log['uid']))}">删除</a></li>
                        </ul>
                        <p class="mt30">{$log.content}</p>
                    </div>
                    
                </div><br>
                <h4>评论</h4>
                <table class="table mt20" id="comlist">
                    <volist name="com" id="vo">
                        <tr class="comitem">
                            <td class="col-md-2">
                                
                                <a href="{:U('/Home/Index/index',array('user_id'=>$vo[uid]))}"><img src="__PUBLIC__{$vo.zonedp}" width="100" height="100" alt="头像"></a><br>
                                <a href="{:U('/Home/Index/index',array('user_id'=>$vo[uid]))}">{$vo.nname}</a>
                            </td>
                            <td class="col-md-9 hfbody">
                                <p>评论时间：{$vo.ctime|date="Y-m-d H:i:s",###}</p>
                                {$vo.content}
                                <!-- 每条评论的回复列表start -->
                                <volist name="vo['hflist']" id="val">
                                    <div class="media replyitem">
                                        <a class="pull-left" href="{:U('/Home/Index/index',array('user_id'=>$val['user1']['id']))}">
                                            <img class="media-object img-rounded" src="__PUBLIC__{$val.user1.zonedp}" height="35" width="35" alt="头像">
                                        </a>
                                        <div class="media-body">
                                            <p class="small">
                                                <a href="{:U('/Home/Index/index',array('user_id'=>$val['user1']['id']))}">{$val.user1.nickname}&nbsp</a><a href="{:U('/Home/Index/index',array('user_id'=>$val['user2']['id']))}">@{$val.user2.nickname}</a>:{$val.content}
                                            </p> 
                                            <div class="small">
                                                {$val.ctime|date="Y-m-d H:i:s",###}
                                                <a href="javascript:void(0)" class="act-com-hf" comid="{$vo.cid}" hfid="{$val.uid}">回复</a>
                                                <a href="javascript:void(0)" class="act-hf-del" dataid={$val.id}>删除</a>
                                            </div>                          
                                        </div>
                                    </div>
                                </volist><!-- 每条评论的回复列表end! -->
                                <div class="huifu"  style="display:none">
                                    <textarea class="form-control" rows="2" name="content"  placeholder=""></textarea>
                                    <button class="action-hf btn btn-primary btn-sm pull-right mt10">发表</button>
                                </div>
                            </td>
                            <td class="col-md-1">
                                <a href="javascript:void(0)" class="act-com-hf" comid="{$vo.cid}" hfid="{$vo.uid}">回复</a>
                                <a href="javascript:void(0)" class="act-com-del" dataid={$vo.cid}>删除</a>
                            </td>
                        </tr>
                    </volist>
                    <tr id="com"><td colspan="3"></td></tr>
                </table>

                <h5>发表评论</h5>

                <div class="row">
                    <div class="col-md-2">
                        <img src="__PUBLIC__{$user.zonedp}" width="100" height="100" alt="头像">
                    </div>
                    <div class="col-md-10">
                        <textarea class="form-control" rows="5" name="content"  placeholder="您可以在这里发表评论"></textarea>
                        <button class="action-comment btn btn-primary btn-sm" logid="{$log.id}">发表</button>
                    </div>
                </div>
            </div>   
        </div>
        <script>
            //回复评论
            $("#comlist").on('click','.act-com-hf',function(){
                var self1 = $(this);
                var comid = self1.attr('comid');
                var hfid = self1.attr('hfid');
                var div = self1.parents('tr').children(".hfbody").children(".huifu");
                div.show();
                div.children('.action-hf').attr({ comid: comid, hfid: hfid });
            });
            $("#comlist").on('click','.action-hf',function(){
                var self2 = $(this);
                var comid = self2.attr('comid');
                var hfid = self2.attr('hfid');
                var content = self2.prev().val().trim();
                if(content.length==0){
                    return false;
                }
                $.ajax({
                    type:'POST',
                    url:'{:U("Home/Log/comhf")}',
                    data:{'com_id':comid,'hfid':hfid,'content':content},
                    dataType:"json",
                    success:function(rs){
                        if(rs.status == 'success'){
                            var divs = '<div class="media replyitem">'+
                                        '<a class="pull-left" href="'+rs.url1+'">'+
                                            '<img class="media-object img-rounded" src="__PUBLIC__'+rs.zonedp1+'" height="35" width="35" alt="头像">'+
                                        '</a>'+
                                        '<div class="media-body">'+
                                            '<p class="small" >'+
                                                '<a href="'+rs.url1+'">'+rs.name1+'&nbsp</a><a href="'+rs.url2+'">@'+rs.name2+'</a>:'+rs.content+
                                            '</p> '+
                                            '<div class="small">'+
                                                rs.ctime+
                                                '<a href="javascript:void(0)" class="act-com-hf" comid="'+comid+'" hfid="'+hfid+'">回复</a>'+
                                                '<a href="javascript:void(0)" class="act-hf-del" dataid='+rs.id+'>删除</a>'+
                                            '</div> '+                         
                                        '</div>'+
                                    '</div>';
                            self2.parent().before(divs);
                            self2.prev().val(''); // 清空输入框
                            self2.parent().hide();
                        }
                    }
                });
            });
            //点赞功能实现
            $("#zan").on('click','.act-fav',function(){
                var self=$(this);
                var id=self.attr('dataid');
                $.ajax({
                    type:'POST',
                    url:'{:U("Home/Log/fav")}',
                    data:{'id':id},
                    dataType:"json",
                    success:function(rs){
                        if(rs.status=='success'){
                            self.html(rs.btn);
                        } else {
                            alert(rs.msg);
                        }
                    }
                });
            });

            //评论删除
            $("#comlist").on('click','.act-com-del',function(){
                var self = $(this);
                var id = self.attr('dataid');
                $.ajax({
                    type:'POST',
                    url:'{:U("Home/Log/delcom")}',
                    data:{'id':id},
                    dataType:"json",
                    success:function(rs){
                        if(rs.status == 'success'){
                            self.parents('tr.comitem').remove();
                        }else{
                            alert(rs.msg);
                        }
                        
                    }
                });
            });

            //回复删除
            $('#comlist').on('click','.act-hf-del',function(){
                var self = $(this);
                var id = self.attr('dataid');
                $.ajax({
                    type:'POST',
                    url:'{:U("Home/Log/delhf")}',
                    data:{'id':id},
                    dataType:"json",
                    success:function(rs){
                        if(rs.status == 'success'){
                            self.parents('div.replyitem').remove();
                        }else{
                            alert(rs.msg);
                        }
                    }
                });
            });

            //发表评论
            $('.action-comment').on('click',function(){
                // debugger;
                var id = $(this).attr('logid');
                var content = $(this).prev().val().trim();
                if(content.length==0){
                    return false;
                }
                // alert(content);

                $.ajax({
                    type: "POST",
                    url: "{:U('comment')}",
                    data: {"content":content,"who_id":id},
                    dataType: "json",
                    success: function(rs){
                        if(rs.status == 'success'){
                            var divs = '<tr class="comitem">'+
                            '<td class="col-md-2">'+
                                
                                '<a href="'+rs.url+'"><img src="__PUBLIC__'+rs.zonedp+'" width="100" height="100" alt="头像"></a><br>'+
                                '<a href="'+rs.url+'">'+rs.name+'</a>'+
                            '</td>'+
                            '<td class="col-md-9 hfbody">'+
                                '<p>评论时间：'+rs.ctime+'</p>'+
                                rs.content+
                                '<div class="huifu"  style="display:none">'+
                                    '<textarea class="form-control" rows="2" name="content"  placeholder=""></textarea>'+
                                    '<button class="action-hf btn btn-primary btn-sm pull-right mt10">发表</button>'+
                                '</div>'+
                            '</td>'+
                            '<td class="col-md-1">'+
                                '<a href="javascript:void(0)" class="act-com-hf" comid="'+ rs.id +'" hfid="'+ rs.uid +'" >回复</a>'+
                                '<a href="javascript:void(0)" class="act-com-del" dataid="'+rs.id+'">删除</a>'+
                            '</td>'+
                        '</tr>';
                            $("#com").before(divs);
                            $("textarea[name='content']").val(''); // 清空输入框
                        }
                    }
                });
            });
        </script>
    </block>